const {observable,autorun,decorate,computed,when,reaction}=require('mobx')

// ---------监听一个对象的数据-------
// class Person{
//     constructor(firstname,lastname,age){
//         this.firstname=firstname
//         this.lastname=lastname
//         this.age=age
        
        // autorun注册一个回调函数
        // 第一次会立刻执行，以后当数据发生变化时回调函数就会被立即调用
        // autorun(()=>{
        //     console.log(this.firstname,this.lastname,this.age)
        // })
    // }
    //    ES6新语法，用来声明一个只读属性
//     get fullname(){
//         return this.firstname+this.lastname
//     }
// }
// decorate(Person,{
//     firstname:observable,
//     lastname:observable,
//     age:observable,
//     fullname:computed
// })

// let p1=new Person("张","三",18)

// autorun回调函数也可以在对象外面执行
// autorun(()=>{
//         console.log(p1.firstname,p1.lastname,p1.age)
//     })  

// p1.firstname="李"


// ------------对一个对象进行观察----------
// 返回一个被观察的对象
// let p1=observable.object({
//     firstname:"张",
//     lastname:"三",
//     age:18,
//     get fullname(){
//         return this.firstname+this.lastname
//     }
// })
// autorun(()=>{
//     console.log(p1.firstname,p1.lastname)
// })
// p1.firstname="李"


// -------------对数组进行进行观察-------------
// let arr=observable(["hello","world"])
// autorun(()=>{
// console.log(arr)
// })
// arr.push("goodbye")

let numberlist=observable([2,4,6])

// computed可以定义一个计算对象，计算对象通过get()方法调用
let sum=computed(()=>{
    let total=0
    for (let number of numberlist) {
        total+=number
    }
    return total
})

autorun(()=>{
    console.log(sum.get())
})
numberlist.push(8)



